{% extends "registration/base.html" %}

{% block title %}Sign up{% endblock %}

{% block content %}
  <h1>Create an account</h1>

  <p>Or, <a href="https://code.djangoproject.com/github/login">login with GitHub</a>.</p>

  {% if form.errors %}
    <p class="errors">Please correct the errors below: {{ form.non_field_errors }}</p>
  {% endif %}


  <form method="post" action="" class="form-input">
    {% csrf_token %}
    <div>
      <label for="id_username">Username:</label>
      {% if form.username.errors %}
        <p class="errors">{{ form.username.errors.as_text }}</p>
      {% endif %}
      {{ form.username }}
    </div>
    <div>
      <label for="id_email">Email address:</label>
      {% if form.email.errors %}
        <p class="errors">{{ form.email.errors.as_text }}</p>
      {% endif %}
      {{ form.email }}
    </div>
    <div>
      <label for="id_password1">Password:</label>
      {% if form.password1.errors %}
        <p class="errors">{{ form.password1.errors.as_text }}</p>
      {% endif %}
      {{ form.password1 }}
    </div>
    <div>
      <label for="id_password2">Password (type again to catch typos):</label>
      {% if form.password2.errors %}
        <p class="errors">{{ form.password2.errors.as_text }}</p>
      {% endif %}
      {{ form.password2 }}
    </div>
    <p class="submit">
        <input type="submit" class="cta" value="Register">
    </p>
  </form>

{% endblock %}

{% block content-related %}
    <h1 class="visuallyhidden">Help</h1>
    <div role="complementary">
        <p>Fill out the form to the right (all fields are required), and your
            account will be created; you'll be sent an email with instructions on how
            to finish your registration.</p>

        <p>We'll only use your email to send you signup instructions. We hate spam
            as much as you do.</p>

        <p>This account will let you log into the ticket tracker, claim tickets,
            and be exempt from spam filtering.</p>

        <p>Your username can only consist of alphanumeric characters and
            underscores and may be up to 30 characters long.</p>
    </div>
{% endblock %}
